<template>
  <div>
      <Title/>
      <div style="width:1152px;margin:0 auto;margin-top:24px">
        <el-card style="color:#555555">
          Extrinsics详情
        </el-card>
        <el-card style="margin-top:$router.push('/testDemo')">
          <el-table
            :data="extrinsics_info"
            :show-header="false"
            style="width: 100%">
            <el-table-column
              prop="name"
              label="区块号"
              width="160">
            </el-table-column>
            <el-table-column
              prop="value"
              label="区块号"
              width=auto>
              <template slot-scope="scope">
                <div v-html='scope.row.value'></div>
              </template>
            </el-table-column>
          </el-table>
        </el-card>
      </div>
  </div>
</template>

<script>
/* eslint-disable */

import axios from 'axios'
import qs from 'qs'
import Title from "./title.vue"
export default {
  name: 'Main',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App',
      hash: '',
      id: '',
      extrinsics_info:[
        {name: "时间", value: ""},
        {name: "模块", value: ""},
        {name: "方法", value: ""},
        {name: "签名", value: ""},
        {name: "Hash", value: ""},
        {name: "手续费", value: ""},
        {name: "状态", value: ""},
        {name: "发送者", value: ""},
        {name: "所属区块号", value: ""},
        {name: "所属区块Hash", value: ""},
        {name: "参数", value: ""},
        {name: "参数解析", value: ""},
      ]
    }
  },
  components:{
    Title
  }, mounted: function () {
    this.hash = this.$route.params.hash
    this.id = this.$route.params.id

    this.Flush()
  }, destroyed: function () {
  },
  methods: {
    getYMDHMS (timestamp) {
      let time = new Date(timestamp)
      let year = time.getFullYear()
      const month = (time.getMonth() + 1).toString().padStart(2, '0')
      const date = (time.getDate()).toString().padStart(2, '0')
      const hours = (time.getHours()).toString().padStart(2, '0')
      const minute = (time.getMinutes()).toString().padStart(2, '0')
      const second = (time.getSeconds()).toString().padStart(2, '0')

      return year + '-' + month + '-' + date + ' ' + hours + ':' + minute + ':' + second
    },
    Flush(){
      var self = this
      var url = ''
      if( !this.id) {
        url = "/api/get_extrinsics/"+this.hash
      }else{
        url = "/api/get_extrinsics/"+this.hash+"/"+this.id
      }
      console.log(url)
      axios.get(url).then(function(data){
        var object = data.data;
        self.extrinsics_info[0].value = self.getYMDHMS(object.time)
        self.extrinsics_info[1].value = object.pallet
        self.extrinsics_info[2].value = object.method
        self.extrinsics_info[3].value = object.signature
        self.extrinsics_info[4].value = object.hash
        self.extrinsics_info[5].value = (object.partialFee/10000000000).toFixed(5)+' DOT'
        self.extrinsics_info[6].value = object.success==="1"?"成功":"失败"
        self.extrinsics_info[7].value = object.signer == 'None'?'':object.signer
        self.extrinsics_info[8].value = object.block_number
        self.extrinsics_info[9].value = '<a class="AddressLabel" href="'+'/#/blocks/'+object.block_hash+'">'+object.block_hash+'</a>'
        self.extrinsics_info[10].value = object.args
        if (object.pallet == "balances" && (object.method == "transfer" || object.method == "transferKeepAlive")){
          var transaction_obj = JSON.parse(object.args)
          self.extrinsics_info[11].value = "向地址 "+transaction_obj.dest+" 转账 "+(transaction_obj.value/10000000000).toFixed(2) + " DOT"
        }
        //self.extrinsics_info[10].value = 
        /*
        "pallet": row[0],
        "method": row[1],
        "signature": row[2],
        "nonce": row[3],
        "args": row[4],
        "hash": row[5],
        "partialFee": row[6],
        "success": row[7],
        "block_id": row[8],
        "signer": row[9],
        "block_number": row[10],
        "block_hash": row[11],
        "time": row[12]
        */
      })
    }
  }
}
</script>
<style lang="scss">
@import "../style/self.scss"; 
.AddressLabel{
  color:#21a3fb;
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;
}
</style>